<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <base href="<%=basePath%>">
    
    <title>登录页面</title>
    
	<jsp:include page="include.jsp"></jsp:include>
	<link href="./resource/css/signin.css" rel="stylesheet">
    <style type="text/css">
    </style>
    
  </head>
 
  <body>
  
  <div class="mainBackground">
    <div class="container" style="background: rgba(255, 255, 255, 0.18);">    
      <form class="form-signin" method="post" role="form" action="indexController/process/login" id="login_form">
        <h2 class="form-signin-heading">小七当家</h2>
        <label for="inputName" class="sr-only">请输入用户名</label>
        <input type="text" id="name" name="name" class="form-control" placeholder="请输入用户名"  required autofocus>
        	
        <label for="inputPassword" class="sr-only">请输入密码</label>
        <input type="password" id="password" name="password" class="form-control" placeholder="请输入密码" required>
        <text style="color:#FF9191 " class="hide error_message">用户名或者密码不正确</text>
        <div class="checkbox">
          <label>
            <input type="checkbox" value="remember-me"> 记住账号
          </label>
        </div>
        <button class="btn btn-lg btn-login btn-block" type="submit" onclick="$('#login_form').submit();">登 录</button>
      </form>
    </div> <!-- /container -->
    <div class="container imgBackground">
    	<div>
        <img alt="" src="./resource/images/qrCode.png">
        <p>客户端下载</p>
      </div>
<!--     	<div class="row">
    	  <div class="col-md-4"></div>
          <div class="col-md-2">
        	<img alt="" src="./resource/images/qrCode.png">
        	<p>andriod客户端</p>
          </div>
      	  <div class="col-md-2">
            <img alt="" src="./resource/images/qrCode.png">
            <p>ios客户端</p>
          </div>
          <div class="col-md-4"></div>
    	</div> -->
    </div>
  </div>
  
  <div class="footBackground">
	  <footer class="bd-footer text-muted">
  	  <div class="container">
  	  	<div class="row">
  	  	<p class="col-md-8">Copyright © 深圳市兴海物联科技有限公司</p>
  	    <ul class="bd-footer-links col-md-4">
  	      <li><a href="#">关于我们&nbsp;&nbsp;&nbsp;|</a></li>
  	      <li><a href="#">法律声明&nbsp;&nbsp;&nbsp;|</a></li>
  	      <li><a href="#">联系我们&nbsp;&nbsp;&nbsp;|</a></li>
  	      <li><a href="#">官方网站</a></li>
  	    </ul>
  	    </div>
  	  </div>
	 </footer>
  </div>

  <script>
    $(document).ready(function () { //用户名密码错误，弹出提示框
      if(getQueryString("error")==1){
          $(".error_message").removeClass("hide");
      }
      $("#login_form").validate({//表单验证
          rules: {
            name: {
              required: true,
            },
            password: {
              required: true,
              minlength: 6
            }
          },
          messages: {
            name: {
              required: "请输入手机号",
              number:   "请输入合法数字",
              minlength: "手机号至少为8位数",
              maxlength: "手机号至多为11位数"
            },
            password: {
              required: "请输入密码",
              minlength: "密码长度不能小于 6 个字母"
            }
          }
      });
    });

    function getQueryString(name) {//获取某个url中所带的参数
      var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
      var r = window.location.search.substr(1).match(reg);
      if (r != null) return unescape(r[2]); return null;
    }
    
  </script>
  
  </body>
</html>
